// import {defineStore} from 'pinia'
// import {navAllList} from "@/json/nav.ts"
//
// export interface IconSetting {
//     desWidth: number,
//     size: number,
//     iconSize: number,
// }
//
// interface NavStore {
//     navAllList: [],
//     // 设置内容
//     setContent: any,
//     // 历史搜索记录
//     historySearchList: [],
//     // 当前正在展示的 列表数据
//     currentNavList: {},
//     // 图标设置
//     tabIconSetting: IconSetting,
// }
//
// // 存储应用程序的位置
// const useNavStore = defineStore('nav', {
//     state: () => ({
//
//         // 要展示的列表数据
//         navAllList: navAllList,
//         // 存储数据
//         setContent: setContent, //设置内容
//         // 历史搜索记录
//         historySearchList: [],
//         // 当前正在展示的 列表数据
//         currentNavList: {},
//         // 图标设置
//         tabIconSetting: {
//             desWidth: 800, // 桌面宽度
//             iconSize: 64, // 图标大小
//             space: 10,// 间距大小
//             colNum: 8, // 网格栏数
//             breakpoints: {lg: 1200, md: 992, sm: 768, xs: 576}, // 响应式断点
//             cols:{ lg: 12, md: 10, sm: 8, xs: 6}, //
//         }
//     }),
//     getters: {
//         // 获取图标设置信息
//         getTabIconSetting: (state) => {
//             return state.tabIconSetting
//         },
//         // 获取网格栏数
//         getWidth: (state): number => {
//             let width = state.tabIconSetting.colNum * (state.tabIconSetting.iconSize + state.tabIconSetting.space) + state.tabIconSetting.space
//             return width
//         },
//         getBreakpoints: (state) : Object  => {
//             function getWidthByColNum  (num: number) {
//                 return num * (state.tabIconSetting.iconSize + state.tabIconSetting.space) + state.tabIconSetting.space
//             }
//             const cols = state.tabIconSetting.cols
//             let br = {
//                 lg: getWidthByColNum(cols.lg) - 1,
//                 md: getWidthByColNum(cols.md) - 1,
//                 sm: getWidthByColNum(cols.sm) - 1,
//                 xs: getWidthByColNum(cols.xs) - 1
//             }
//             return br
//         }
//     },
//     actions: {
//         setColNumByWidth  (width: number)  {
//             width = width - 150
//             this.tabIconSetting.desWidth = width
//             // 网格栏数
//             this.tabIconSetting.colNum = width / (this.tabIconSetting.iconSize + this.tabIconSetting.space) | 0
//
//             this.tabIconSetting.breakpoints = {
//                 lg: this.tabIconSetting.desWidth,
//                 md: this.tabIconSetting.desWidth - 100, sm: 768, xs: 576
//             }
//             this.tabIconSetting.cols = {
//                 lg: this.tabIconSetting.colNum,
//                 md: this.tabIconSetting.colNum, sm: 8, xs: 6
//             }
//         }
//
//     },
// })
//
//
// // 需要缓存的数据
// // 1. 当前正在使用的搜索引擎 key
//
//
// const setContent = {
//     // 壁纸
//     bgBlur: 0, //背景进行模糊处理
//     themeMode: 'light', //主题模式
//     sunrise: false, //主题样式跟随日出日落
//     // 常规设置
//     iconSize: 82, //图标大小
//     iconRadius: 100, //图标半径
//     iconOpacity: 90, //图标透明度
//     iconTitle: true, //图标标题
//     startAnimation: true, //启动动画
//     layout: [2, 6], //图标布局
//     yiyan: true, //是否显示一言
//     search: 'baidu', //默认搜索
// }
//
// export default useNavStore
//
// // getter 中的方法
// /*
// * 1
// *  getTabIconSetting () {
//       return this.tabIconSetting
//    },
//    // 2
//    getTabIconSetting: (state) => {
//             return state.tabIconSetting
//    },
// *
// *
// *
// * */
